extends layout
append scripts
    script.
        // ajax(url, settings) 函数需要接收一个 URL 和一个可选的 settings 对象, 常用的选项如下
        // async: 是否异步执行 AJAX 请求, 默认为true, 千万不要指定为 false
        // method: 发送的 Method, 缺省为 'GET', 可指定为 'POST'、'PUT' 等
        // contentType: 发送 POST 请求的格式, 默认值为 'application/x-www-form-urlencoded; charset=UTF-8', 也可以指定为 text/plain、application/json
        // data: 发送的数据, 可以是字符串、数组或 object,
        //      如果是 GET 请求, data 将被转换成 query 附加到URL上, 如果是 POST 请求, 根据 contentType 把 data 序列化成合适的格式
        // headers: 发送的额外的 HTTP 头, 必须是一个 object
        // dataType: 接收的数据格式, 可以指定为 'html'、'xml'、'json'、'text' 等, 缺省情况下根据响应的 Content-Type 猜测
        var jqxhr = $.ajax('/api/categories', { dataType: 'json' });  // 请求已经发送了
        // jQuery 的 jqXHR 对象类似一个 Promise 对象, 我们可以用链式写法来处理各种回调
        // The jqXHR (jQuery XMLHttpRequest) replaces the browser native XMLHttpRequest object.
        // jQuery wraps the browser native XMLHttpRequest object with a superset API.
        // The jQuery XMLHttpRequest (jqXHR) object is returned by the $.ajax() function.
        // The jqXHR object simulates native XHR functionality where possible.
        // 在现代浏览器上写 AJAX 主要依靠 XMLHttpRequest 对象
        var jqxhr = $.ajax('/api/categories', { dataType: 'json'  // file 协议连本地的资源都不让访问
        }).done(function (data) { console.log('成功, 收到的数据: ' + JSON.stringify(data));
        }).fail(function (xhr, status) { console.log('失败: ' + xhr.status + ', 原因: ' + status);
        }).always(function () { console.log('请求完成: 无论成功或失败都会调用');
        });
        // get(), 常用的 AJAX 操作, jQuery 提供了一些辅助方法
        var jqxhr = $.get('/path/to/resource', { name: 'Bob Lee', check: 1 });  // 自己不用怎么进行 URL 编码了
        // 第二个参数如果是 object, jQuery 自动把它变成 query string 然后加到 URL 后面, 实际的 URL 是: /path/to/resource?name=Bob%20Lee&check=1
        // post() 和 get() 类似, 但是传入的第二个参数默认被序列化为 application/x-www-form-urlencoded
        var jqxhr = $.post('/path/to/resource', { name: 'Bob Lee', check: 1 });
        // 实际构造的数据 name=Bob%20Lee&check=1 作为 POST 的 body 被发送。
        // getJSON() 方法来快速通过GET获取一个 JSON 对象
        var jqxhr = $.getJSON('/path/to/resource', { name: 'Bob Lee', check: 1
        }).done(function (data) { // data 已经被解析为 JSON 对象了
        });
        // 安全限制
        // jQuery 的 AJAX 完全封装的是 JavaScript 的 AJAX 操作, 所以它的安全限制和前面讲的用 JavaScript 写 AJAX 完全一样
        // 如果需要使用 JSONP, 可以在 ajax() 中设置 jsonp: 'callback', 让 jQuery 实现 JSONP 跨域加载数据
